<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>用户列表</title>
<script type="text/javascript"
	src="http://lib.sinaapp.com/js/jquery/2.0.3/jquery-2.0.3.min.js"></script>
<script type="text/javascript">
    var pageNumber = 1;
    var pageSize = 10;
    var base = '<%=request.getAttribute("base")%>';
	function user_reload() {
		$.ajax({
			url : base + "/user/query",
			data : $("#user_query_form").serialize(),
			dataType : "json",
			success : function(data) {
				console.log(data);
				$("#user_count").html(
						"共" + data.pager.recordCount + "个用户, 总计"
								+ data.pager.pageCount + "页");
				var list_html = "";
				console.log(data.list);
				for (var i = 0; i < data.list.length; i++) {
					var user = data.list[i];
					console.log(user);
					
					var tmp = "\n<p>" + user.userID + " " + user.userName  
							+ " <button onclick='user_update(" + user.userID
							+ ");'>修改</button> "
							+ " <button onclick='user_delete(" + user.userID
							+ ");'>删除</button> " + "</p>";
					list_html += tmp;
				}
				$("#user_list").html(list_html);
			}
		});
	}
	$(function() {
		user_reload();
		$("#user_query_btn").click(function() {
			user_reload();
		});
		$("#user_add_btn").click(function() {
			$.ajax({
				url : base + "/user/add",
				data : $("#user_add_form").serialize(),
				dataType : "json",
				success : function(data) {
					if (data.ok) {
						user_reload();
						alert("添加成功");
					} else {
						alert(data.msg);
					}
				}
			});
		});
	});
	function user_update(userID) {
		var passwd = prompt("请输入新的密码");
		if (passwd) {
			$.ajax({
				url : base + "/user/update",
				data : {
					"userID" : userID,
					"password" : passwd
				},
				dataType : "json",
				success : function(data) {
					if (data.ok) {
						user_reload();
						alert("修改成功");
					} else {
						alert(data.msg);
					}
				}
			});
		}
	};
	function user_delete(userID) {
		var s = prompt("请输入y确认删除");
		if (s == "y") {
			$.ajax({
				url : base + "/user/delete",
				data : {
					"userID" : userID
				},
				dataType : "json",
				success : function(data) {
					if (data.ok) {
						user_reload();
						alert("删除成功");
					} else {
						alert(data.msg);
					}
				}
			});
		}
	};
</script>
</head>
<body>
	<a href="${base}/user/profile/">个人资料</a>
	<hr>
	<div>
		<form action="#" id="user_query_form">
			条件<input type="text" name="userID"> 页数<input type="text"
				name="pageNumber" value="1"> 每页<input type="text"
				name="pageSize" value="10">
				<button id="user_query_btn">查询</button>
		</form>
		<hr>
		<p id="user_count"></p>
		<div id="user_list"></div>
	</div>
	<hr>
	<div id="user_add">
		<form action="#" id="user_add_form">
			用户ID<input name="userID"> 
			用户名<input name="userName">
			密码<input name="password">
			<button id="user_add_btn">新增</button>
		</form>
	</div>
</body>
</html>